jQuery(function($) {
/*
var ddData = [
    {
        text: "Facebook",
        value: 1,
        selected: false,
        description: "Có thể đặt lịch cho máy",
        imageSrc: "http://dl.dropbox.com/u/40036711/Images/facebook-icon-32.png"
    },
    {
        text: "Twitter",
        value: 2,
        selected: false,
        description: "Không thể đặt lịch cho máy",
        imageSrc: "http://dl.dropbox.com/u/40036711/Images/twitter-icon-32.png"
    },
    {
        text: "LinkedIn",
        value: 3,
        selected: false,
        description: "Không thể đặt lịch cho máy",
        imageSrc: "http://dl.dropbox.com/u/40036711/Images/linkedin-icon-32.png"
    },
    {
        text: "Foursquare",
        value: 4,
        selected: false,
        description: "Có thể đặt lịch cho máy",
        imageSrc: "http://dl.dropbox.com/u/40036711/Images/foursquare-icon-32.png"
    }
];




$('#demoBasic').ddslick({
    data: ddData,
    width: 300,
    imagePosition: "left",
    selectText: "Chọn máy đặt lịch",
    onSelected: function (result) {
         
        $('#calendar').hide('slow');
        $('#calendar').show('slow');

        $('#val_may').val(result.selectedData.value);



       $.ajaxSetup(
                            {
                                cache: false,
                                beforeSend: function() {
                                    $('#content').hide();
                                    $('#loading').show();
                                },
                                complete: function() {
                                    $('#loading').hide();
                                    $('#content').show();
                                },
                                success: function() {
                                    $('#loading').hide();
                                    $('#content').show();
                                }
                            });
                            var $container = $("#frm_content");
                            $container.load('http://192.168.1.19/TTNaNoNangLuong/wp-content/themes/TTNangLuongNaNo/process.php');
    }

});


*/










	$('#btn_datlich').click(function(){
		$("#event_edit_container").show();
	});


   var $calendar = $('#calendar');
   var id = 10;

   
   
   $calendar.weekCalendar({
      timeslotsPerHour : 2,
      allowCalEventOverlap : false,
      overlapEventsSeparate: false,
      firstDayOfWeek : 1,
      businessHours :{start: 1, end: 24, limitDisplay: true },
      daysToShow : 5,
      height : function($calendar) {
         return $(window).height() - $("h1").outerHeight() - 1;
      },
      eventRender : function(calEvent, $event) {
         if (calEvent.end.getTime() < new Date().getTime() || calEvent.start.getTime() < new Date().getTime() ) {   //Check time start and time end < time hiện tại
            $event.css("backgroundColor", "#FC938F");
            $event.find(".wc-time").css({
               "backgroundColor" : "red",
               "border" : "1px solid #888"
            });
         }
      },
      draggable : function(calEvent, $event) {
         return calEvent.readOnly != true;
      },
      resizable : function(calEvent, $event) {
         return calEvent.readOnly != true;
      },
	  
	  
      eventNew : function(calEvent, $event) {
	  
	  
	  
	  
	  var vl_ngaydat=calEvent.start.getTime();
	  var vl=new Date().getTime();
	
	  
	  //alert('Giờ bắt đầu :'.vl_ngaydat);
	  //alert('Giờ bắt đầu :'.vl);
	  
	  
	  
	  if (calEvent.end.getTime() > new Date().getTime() && calEvent.start.getTime() > new Date().getTime() ) {   //Check time start and time end > time hiện tại
	  
         var $dialogContent = $("#event_edit_container");
         resetForm($dialogContent);
         var startField = $dialogContent.find("select[name='start']").val(calEvent.start);
         var endField = $dialogContent.find("select[name='end']").val(calEvent.end);
         var titleField = $dialogContent.find("input[name='title']");
         var bodyField = $dialogContent.find("textarea[name='body']");
	
		
         $dialogContent.dialog({
            modal: true,
            title: "Thông tin đặt lịch .",
            close: function() {
               $dialogContent.dialog("destroy");
               $dialogContent.hide();
               $('#calendar').weekCalendar("removeUnsavedEvents");
            },
            buttons: {
               save : function() {	
			   var value=1;
				if(value==1){
                  calEvent.id = id;
                  id++;
                  calEvent.start = new Date(startField.val());
                  calEvent.end = new Date(endField.val());
                  calEvent.title = titleField.val();
                  calEvent.body = bodyField.val();
                 

                  $calendar.weekCalendar("removeUnsavedEvents");
                  $calendar.weekCalendar("updateEvent", calEvent);
				  $dialogContent.dialog("close");
				  }else{
					alert('Đã có người đặt vào thời gian bạn chọn !!!!');
				  }
               },
               cancel : function() {
                  $dialogContent.dialog("close");
               }
            }
         }).show();

         $dialogContent.find(".date_holder").text($calendar.weekCalendar("formatDate", calEvent.start));
         setupStartAndEndTimeFields(startField, endField, calEvent, $calendar.weekCalendar("getTimeslotTimes", calEvent.start));

      }
	  else{
	  alert('Không đặt được lịch !!!');
	  return;
	  }
	  },
      eventDrop : function(calEvent, $event) {
        
      },
      eventResize : function(calEvent, $event) {
      },
      
      eventMouseover : function(calEvent, $event) {
      },
      eventMouseout : function(calEvent, $event) {
      },
      noEvents : function() {

      },
      data : function(start, end, callback) {
         callback(getEventData());
      }
   });

   function resetForm($dialogContent) {
      $dialogContent.find("input").val("");
      $dialogContent.find("textarea").val("");
   }

   function getEventData() {
      var year = new Date().getFullYear();
      var month = new Date().getMonth();
      var day = new Date().getDate();

      return {
         events : [
            {
               "id":1,
               "start": new Date(year, month, day, 12),
               "end": new Date(year, month, day, 13, 30),
               "title":"Lê Duy Khánh"
            },
            {
               "id":2,
               "start": new Date(year, month, day, 15),
               "end": new Date(year, month, day, 15, 30),
               "title":"Siêu nhân"
            },
            {
               "id":3,
               "start": new Date(year, month, day + 1, 17),
               "end": new Date(year, month, day + 1, 17, 60),
               "title":"Thạch xanh "
            },
			  {
               "id":4,
               "start": new Date(year, month, day + 1, 16),
               "end": new Date(year, month, day + 1, 16, 60),
               "title":"Lý Thông"
            },
			 
			
            {
               "id":4,
               "start": new Date(year, month, day - 1, 8),
               "end": new Date(year, month, day - 1, 9, 30),
               "title":"Tây môn khánh"
            },
            {
               "id":5,
               "start": new Date(year, month, day + 1, 14),
               "end": new Date(year, month, day + 1, 15),
               "title":"Tên user"
            },
            {
               "id":6,
               "start": new Date(year, month, day, 10),
               "end": new Date(year, month, day, 11),
               "title":"I'm read-only",
               readOnly : true
            }

         ]
      };
   }


   /*
    * Sets up the start and end time fields in the calendar event
    * form for editing based on the calendar event being edited
    */
   function setupStartAndEndTimeFields($startTimeField, $endTimeField, calEvent, timeslotTimes) {

      for (var i = 0; i < timeslotTimes.length; i++) {
         var startTime = timeslotTimes[i].start;
         var endTime = timeslotTimes[i].end;
         var startSelected = "";
         if (startTime.getTime() === calEvent.start.getTime()) {
            startSelected = "selected=\"selected\"";
         }
         var endSelected = "";
         if (endTime.getTime() === calEvent.end.getTime()) {
            endSelected = "selected=\"selected\"";
         }
         $startTimeField.append("<option value=\"" + startTime + "\" " + startSelected + ">" + timeslotTimes[i].startFormatted + "</option>");
         $endTimeField.append("<option value=\"" + endTime + "\" " + endSelected + ">" + timeslotTimes[i].endFormatted + "</option>");

      }
      $endTimeOptions = $endTimeField.find("option");
      $startTimeField.trigger("change");
   }

   var $endTimeField = $("select[name='end']");
   var $endTimeOptions = $endTimeField.find("option");

   //reduces the end time options to be only after the start time options.
   $("select[name='start']").change(function() {
      var startTime = $(this).find(":selected").val();
      var currentEndTime = $endTimeField.find("option:selected").val();
      $endTimeField.html(
            $endTimeOptions.filter(function() {
               return startTime < $(this).val();
            })
            );

      var endTimeSelected = false;
      $endTimeField.find("option").each(function() {
         if ($(this).val() === currentEndTime) {
            $(this).attr("selected", "selected");
            endTimeSelected = true;
            return false;
         }
      });

      if (!endTimeSelected) {
         //automatically select an end date 2 slots away.
         $endTimeField.find("option:eq(1)").attr("selected", "selected");
      }

   });


   var $about = $("#about");

   $("#about_button").click(function() {
      $about.dialog({
         title: "About this calendar demo",
         width: 600,
         close: function() {
            $about.dialog("destroy");
            $about.hide();
         },
         buttons: {
            close : function() {
               $about.dialog("close");
            }
         }
      }).show();
   });


});